var gulp = require('gulp')                    // 任务分发工具 
var typescript = require('gulp-typescript')   // 编译器
var sourcemaps = require('gulp-sourcemaps')   // sourcemaps 生成，用于 debug
var webpack = require('webpack-stream')       // JS 模块化打包
var rimraf = require('rimraf')                // 删除文件
var path = require('path')                    
var tsconfig = require('./tsconfig.json')     // TypeScript 配置

const PROJ_DIR = __dirname                    // 项目目录
const SOURCE_DIR = path.join(PROJ_DIR, 'src') // 源文件目录
const DIST_DIR = path.join(PROJ_DIR, 'dist')  // 目标文件目录

function watch(sources, tasks) {
// 文件监视程序，当文件修改的时候触发一些事件
// sources: Array<string> - 监视的文件路径
// tasks: Array<strings> - 打算运行的任务
  gulp.watch(sources, {
    debounceDelay: 20,
    mode: 'auto',
    cwd: PROJ_DIR
  }).on('change', function (e) {
    var now = new Date()
    var time = now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds()
    var pathname = path.relative(process.cwd(), e.path)
    console.log('[\033[90m' + time + '\033[0m] ' + pathname + ' was \033[35m' + e.type + '\033[0m')
    gulp.start.apply(gulp, tasks)
  })
}

function compileView(pathname) {
// 使用 WebPack 打包 TSX 文件
// pathname: string - 主文件路径
  return function () {
    var ws = webpack({
      target: 'web',
      output: {
        filename: pathname.replace(/^\.?\/?src\/?/, '').replace(/\.tsx$/, '.js')
      },
      externals: [
        {
          'react': 'React',
          'react-dom': 'ReactDOM',
          'react-channel': 'ReactChannel'
        }
      ],
      resolve: {
        extensions: ['', '.tsx'],
      },
      devtool: 'source-map',
      module: {
        loaders: [
          { 
            test: /\.tsx$/,          // 文件的扩展名 
            loader: "ts-loader",     // 用于处理 TSX 语法的文件
            exclude: /node_modules/  // 忽略扫描的目录
          }
        ]
      }
    }).on('error', function (error) {
      console.error(error.toString())
      this.emit('end')
    })
    return gulp
            .src(pathname, {
              base: PROJ_DIR
            })
            .pipe(ws)
            .pipe(gulp.dest(DIST_DIR))
  }
}

function clearDist(dirname) {
// 删除目录文件
// dirname: string
  return function () {
    rimraf.sync(path.join(DIST_DIR, dirname))
  }
}

function copy(sources) {
// 拷贝源文件到目标目录
// sources: Array<string>
  return function () {
    return gulp
            .src(sources, {
              base: SOURCE_DIR
            })
            .pipe(gulp.dest(DIST_DIR))
  }
}

gulp.task('copy', copy(['./src/**/*.!(tsx|ts)']))
gulp.task('hello', compileView('./src/hello.tsx'))
gulp.task('hello2', compileView('./src/hello2.tsx'))
gulp.task('watchfiles', function () {
  watch(['./src/**/*.!(tsx|ts)'], ['copy'])
  watch(['./src/**/*.tsx'], ['hello', 'hello2'])
})
gulp.task('clear', clearDist('.'))
gulp.task('watch', ['clear', 'copy', 'hello', 'hello2', 'watchfiles'])